import React, { useState } from 'react';
import Divson from './components/Divson';
import { useDispatch, useSelector } from 'react-redux'
import {rootState} from '../../store/store'
import {add} from '../../store/actions'



export const {Provider, Consumer} = React.createContext({name:'', age:0})
const Detail:React.FC = () => {
    const [name, setName] = useState('A');
    const [age, setAge] = useState(18);
    const num = useSelector((state:rootState) => state.cal)
    const dispatch = useDispatch();
    const changeName = () => {
        let newName = name
        setName(newName+'A')
        let newAge = age
        setAge(newAge+1)
        dispatch(add(1))
    }
    return (
        <Provider value={{name,age}}>
            <div>
                <span>回到home,这是父组件的name:{name},{age},{num}</span>
                <button onClick={changeName}>改变</button>
                <Divson></Divson>
            </div>
        </Provider>
        
    )
}

export default Detail;